/**
 * Created by Lossa on 2017/1/18.
 */
angular.module('cache-src.directive', [])
    .directive('cacheSrc', ['$http', '$timeout', 'SQLService', function ($http, $timeout, SQLService) {
        return {
            // do not share scope with sibling img tags and parent
            // (prevent show same images on img tag)
            link: function ($scope, elem, attrs) {
                $scope.isIMG = elem[0].tagName === 'IMG';
                function revokeObjectURL() {
                    if (URL.revokeObjectURL) {
                        URL.revokeObjectURL($scope.objectURL);
                    }
                }

                $scope.$watch('objectURL', function (objectURL) {
                    elem.attr('src', objectURL);
                });
                $scope.$on('$destroy', function () {
                    revokeObjectURL();
                });

                //**blob to dataURL**
                $scope.blobToDataURL = function (blob, callback) {
                    var a = new FileReader();
                    a.onload = function (e) {
                        callback(e.target.result);
                    };
                    a.readAsDataURL(blob);
                };

                attrs.$observe('cacheSrc', function (url) {
                    revokeObjectURL();
                    var accept = $scope.isIMG ? 'image/webp,image/*,*/*;q=0.8' : 'audio/wav,audio/ogg,audio/mp3';


                    if (url && url.indexOf('data:') === 0) {
                        $scope.objectURL = url;
                    } else if (url) {
                        SQLService.get(url)
                            .then(function (tx, rs) {
                                console.log('from db:', tempDb)
                                $scope.objectURL = URL.createObjectURL(tempDb);

                            })
                            .then(function () {
                                console.log('request url', url);
                            });

                        $http.get(url, {
                            // responseType: 'arraybuffer',
                            responseType: 'blob',
                            headers: {
                                'accept': accept,
                            }
                        }).then(function (response) {
                            console.log('response from cache-src:', response);
                            if (response) {
                                console.log(response.headers('Content-Type'));
                                // $scope.object = new Blob(
                                //     [response.data],
                                //     {type: response.headers('Content-Type')}
                                // );
                                $scope.object = response.data;
                                $scope.objectURL = URL.createObjectURL($scope.object);
                                SQLService.set(url, $scope.object);
                            } else {
                                elem.attr('src', 'error');
                            }
                        });
                    }
                });
            }
        };
    }]);
